import React, { useEffect, useState } from "react";
import { useLocation, useParams } from "react-router-dom";
import axios from "axios";
import { ItemState } from "../home/index";
const Index = () => {
  // const { id } = useParams();
  // const [item, setItem] = useState<ItemState>();
  // const fetchDetail = async () => {
  //   const resp = await axios.post("/api/detail", { id });
  //   setItem(resp.data.data);
  // };

  // useEffect(() => {
  //   fetchDetail();
  // }, []);

  const location = useLocation();
  const item = location.state as ItemState;

  if (!item) {
    return <div>...</div>;
  }

  return (
    <div>
      <h1>{item.title}</h1>
      <p className="tag">
        {item.tags.map((v, i) => {
          return <span key={i}>{v.tag}</span>;
        })}
      </p>
    </div>
  );
};

export default Index;
